<template>
	<view class="back">
		<!-- <view style="width: 100%;height:5vh;margin-top: 5vh">
			<view style="margin-left: 5vw;display: flex; align-items: center;height:5vh;font-size: 30rpx;"><text style="color: #fff;">{{venuename}}</text></view>
		</view>
		<view class="div2">
			<view class="div2-2" style="display: flex; align-items: center; justify-content: center;color: #636363;" @click="goSearch()">
			    <view style="float: left;"><u-icon name="search" size="38rpx" color="#636363"></u-icon></view>
			    <view style="float: left; margin-left: 10rpx;letter-spacing: 2px;font-size: 28rpx;"><text>查找相关订单</text></view>
			</view>
		</view>
		 课程状态 待训练 进行中 已完成
		<view style="width: 100vw;height: 85vh;background: #fff;margin-top: 30rpx;border-radius: 70rpx 70rpx 0rpx 0rpx;padding-bottom:5vh ;">

			
			<view style="overflow: auto;height: 80vh;width: 100%;margin-top: 60rpx;">
				<view v-if="selectStatus==1" @tap="openTrain(item)" style="width: 90%;height:100px;background-color: #fff;margin: 0 auto;padding: 20rpx;box-shadow: 0 2px 10px #dfdfdf;margin-top: 35px;" v-for="item in DataArray" @click="toApply(item)">
					<view style="width: 2%;height:100px;float: left;font-size: 28rpx;">
						
					</view>
					<view style="width: 50%;height:100px;float: left;font-size: 28rpx;">
						<view style="height: 25px;display: flex;align-items: center;letter-spacing: 5rpx;">学员姓名:{{item.memberUserName}}</view>
						<view style="height: 25px;display: flex;align-items: center;letter-spacing: 5rpx;">现体重:{{item.userWeight}}KG</view>
						<view style="height: 25px;display: flex;align-items: center;letter-spacing: 5rpx;">现体脂率:{{item.userBfp}}%</view>
					</view>
					<view style="width: 46%;height:100px;float: left;font-size: 28rpx;">
						<view style="display: flex;align-items: center;justify-content:flex-end;height: 25px;">
							<text style="color:#9ECFFF ;"  @click.stop  @click="changeFraction(item)">案例评分：{{item.fraction}}</text>
							<u-icon name="arrow-right" size="30rpx" color="#9ECFFF"></u-icon>
						</view>
						 <view style="display: flex;align-items: center;justify-content:flex-end;">
						 	<image src="@/static/tarin.png" style="width: 180rpx;height: 119rpx;margin-right:20rpx ;"></image>
							<u-icon name="more-dot-fill" size="40rpx"></u-icon>
						 </view>
					</view>
					
				</view>
				<view v-if="selectStatus==3" @tap="openTrain(item)" style="width: 90%;height:160px;background-color: #fff;margin: 0 auto;padding: 20rpx;box-sizing: border-box;box-shadow: 0 2px 10px #dfdfdf;margin-bottom: 18px;" v-for="item in courseList">
					<view style="width: 100%;height:112px;">
						<view style="width: 30%;height:112px;float: left;">
							<view style="width: 60%;height:22px;background-color: #9ECFFF;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
							display: flex;align-items: center;justify-content:center;">
								训练前
							</view>
							<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
								<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseStartPhoto"></image>
							</view>
						</view>
						<view style="width: 40%;height:112px;float: left;">
							<view style="margin-top:20rpx;font-size: 28rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">学员:{{item.userName}}</view>
							<view style="margin-top:20rpx;font-size: 48rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;letter-spacing: 5rpx;"><text style="color:#9ECFFF">V</text><text style="color:#92A3FD">S</text></view>
							<view style="margin-top:20rpx;font-size: 32rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">训练{{item.byTime}}天</view>
						</view>
						<view style="width: 30%;height:112px;float: left;">
							<view style="width: 60%;height:22px;background-color: #92A3FD;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
							display: flex;align-items: center;justify-content:center;">
								训练后
							</view>
							<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
								<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseEndingPhoto"></image>
							</view>
						</view>
					</view>
					<view class="info-container">
					    <view class="info-item">
					      <image class="iconn" src="@/static/tizhong.png"></image>
					      <text class="info-text">体重 - {{item.reduceWeight}}KG</text>
					    </view>
					    <view class="info-item">
					      <image class="iconn" src="@/static/jirou.png"></image>
					      <text class="info-text">体脂率 - {{item.reduceBfp}}KG</text>
					    </view>
						<view class="info-item">
							<text class="info-text" style="color: #87C3FF;">取消上传</text>
						</view>
					  </view>
				</view>
				<view v-if="selectStatus==2" @tap="openTrain(item)" style="width: 90%;height:160px;background-color: #fff;margin: 0 auto;padding: 20rpx;box-sizing: border-box;box-shadow: 0 2px 10px #dfdfdf;margin-bottom: 18px;" v-for="item in courseList">
					<view style="width: 100%;height:112px;">
						<view style="width: 30%;height:112px;float: left;">
							<view style="width: 60%;height:22px;background-color: #9ECFFF;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
							display: flex;align-items: center;justify-content:center;">
								训练前
							</view>
							<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
								<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseStartPhoto"></image>
							</view>
						</view>
						<view style="width: 40%;height:112px;float: left;">
							<view style="margin-top:20rpx;font-size: 28rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">学员:{{item.userName}}</view>
							<view style="margin-top:20rpx;font-size: 48rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;letter-spacing: 5rpx;"><text style="color:#9ECFFF">V</text><text style="color:#92A3FD">S</text></view>
							<view style="margin-top:20rpx;font-size: 32rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">训练{{item.byTime}}天</view>
						</view>
						<view style="width: 30%;height:112px;float: left;">
							<view style="width: 60%;height:22px;background-color: #92A3FD;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
							display: flex;align-items: center;justify-content:center;">
								训练后
							</view>
							<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
								<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseEndingPhoto"></image>
							</view>
						</view>
					</view>
					<view class="info-container">
					    <view class="info-item">
					      <image class="iconn" src="@/static/tizhong.png"></image>
					      <text class="info-text">体重 - {{item.reduceWeight}}KG</text>
					    </view>
					    <view class="info-item">
					      <image class="iconn" src="@/static/jirou.png"></image>
					      <text class="info-text">体脂率 - {{item.reduceBfp}}KG</text>
					    </view>
						<view class="info-item">
							<text class="info-text" style="color: #87C3FF;">上传中</text>
						</view>
					  </view>
				</view>
				<view style="height: 220px;"></view>
			</view>
		</view>
		 <view v-if="show">
		      <view class="dialog-overlay" @click="hideDialog"></view>
		      <view class="dialog">
		        <view class="dialog-content" style="width: 80%;height: 80%;">
		          <text>选择评分</text>
		          <view class="rating">
		            <text v-for="(star, index) in stars" :key="index" :class="{ filled: index < rating }" @click="setRating(index + 1)">
		              ★
		            </text>
		          </view>
		          <button @click="hideDialog">确定</button>
		        </view>
		      </view>
		    </view> -->
			
			
			<view style="height: 13%;">
				<view>
					<image style="width: 80rpx;height:80rpx;margin-left: 50rpx;position: relative;top:95rpx;"
						class="shrink-0 image_3"
						src="https://ide.code.fun/api/image?token=658020ebfcfbac001139fd4f&name=3b8f508d119d287a8dfc01e289624070.png" />
				</view>
				<view class="div2">
					<view class="div2-2"
						style="display: flex; align-items: center; justify-content: center;color: #636363;margin-top: 15rpx;"
						>
						<view style="float: left;">
							<image style="width: 40rpx;height: 40rpx;margin-left: -90rpx;" src="../../static/哑铃.png" alt="">
							<image style="width: 40rpx;height: 40rpx;margin-left: -90rpx;" src="/static/哑铃.png" alt="">
							</image>
						</view>
						<view style="float: left; margin-left: 10rpx;letter-spacing: 2px;font-size: 28rpx;">
							<text style="font-weight: bold;">追云健身俱乐部</text>
						</view>
					</view>
				</view>
			</view>
			<view class="view">
				<view class="view1" v-if="selectStatus==1" @tap="openTrain(item)" v-for="item in DataArray" @click="toApply(item)"> 
					<view style="width: 350rpx;height: 300rpx;background-size: cover;background-position: center;background-repeat: no-repeat;" >
						<image :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.memberUserPhoto" style="width: 350rpx;height: 300rpx;border-radius: 10px 10px 0 0;"></image>
						<!--"@/static/tarin.png"-->
					</view>
					<view style="width: 350rpx;height: 180rpx;position: relative;">
						<text style="font-size: 25rpx;margin-left: 15rpx;">入学时间：{{item.createTimes | formatDate }}</text><br>
						<text style="font-size: 25rpx;margin-left: 15rpx;">共上课时：{{item.numberSize}}</text><br>
						<view >
						<text style="font-size: 25rpx;margin-left: 15rpx;float: left;"  >教练评分：</text><u-rate  :count="count"  active-color="#6EE7F0" v-model="item.fraction"></u-rate><br>
						</view>
						<text style="font-size: 25rpx;margin-left: 15rpx;">{{item.memberUserName}}</text><br>
						<view @click.stop  @click="changeFraction(item)" style="width: 190px; height: 30rpx; position: absolute;top: 43px; left: 10rpx; opacity:0"></view>
					</view>
				</view>
			</view>
			<view v-if="show">
			     <view class="dialog-overlay" @click="hideDialog"></view>
			     <view class="dialog">
					<view class="dialog-content" style="width: 80%;height: 80%;">
						<text>选择评分</text>
						<view class="rating">
							<text v-for="(star, index) in stars" :key="index" :class="{ filled: index < rating }" @click="setRating(index + 1)">
							★
							</text>
						</view>
						<button @click="hideDialog" style="background-color: rgba(110, 231, 240, 1);color: white;margin-top: 15rpx;">确定</button>
					</view>
			    </view>
			</view>
			<view v-if="selectStatus==3" @tap="openTrain(item)" style="width: 90%;height:160px;background-color: #fff;margin: 0 auto;padding: 20rpx;box-sizing: border-box;box-shadow: 0 2px 10px #dfdfdf;margin-bottom: 18px;" v-for="item in courseList">
				<view style="width: 100%;height:112px;">
					<view style="width: 30%;height:112px;float: left;">
						<view style="width: 60%;height:22px;background-color: #9ECFFF;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
						display: flex;align-items: center;justify-content:center;">
							训练前
						</view>
						<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
							<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseStartPhoto"></image>
						</view>
					</view>
					<view style="width: 40%;height:112px;float: left;">
						<view style="margin-top:20rpx;font-size: 28rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">学员:{{item.userName}}</view>
						<view style="margin-top:20rpx;font-size: 48rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;letter-spacing: 5rpx;"><text style="color:#9ECFFF">V</text><text style="color:#92A3FD">S</text></view>
						<view style="margin-top:20rpx;font-size: 32rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">训练{{item.byTime}}天</view>
					</view>
					<view style="width: 30%;height:112px;float: left;">
						<view style="width: 60%;height:22px;background-color: #92A3FD;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
						display: flex;align-items: center;justify-content:center;">
							训练后
						</view>
						<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
							<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseEndingPhoto"></image>
						</view>
					</view>
				</view>
				<view class="info-container">
				    <view class="info-item">
				      <image class="iconn" src="@/static/tizhong.png"></image>
				      <text class="info-text">体重 - {{item.reduceWeight}}KG</text>
				    </view>
				    <view class="info-item">
				      <image class="iconn" src="@/static/jirou.png"></image>
				      <text class="info-text">体脂率 - {{item.reduceBfp}}KG</text>
				    </view>
					<view class="info-item">
						<text class="info-text" style="color: #87C3FF;">取消上传</text>
					</view>
				  </view>
			</view>
			<view v-if="selectStatus==2" @tap="openTrain(item)" style="width: 90%;height:160px;background-color: #fff;margin: 0 auto;padding: 20rpx;box-sizing: border-box;box-shadow: 0 2px 10px #dfdfdf;margin-bottom: 18px;" v-for="item in courseList">
				<view style="width: 100%;height:112px;">
					<view style="width: 30%;height:112px;float: left;">
						<view style="width: 60%;height:22px;background-color: #9ECFFF;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
						display: flex;align-items: center;justify-content:center;">
							训练前
						</view>
						<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
							<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseStartPhoto"></image>
						</view>
					</view>
					<view style="width: 40%;height:112px;float: left;">
						<view style="margin-top:20rpx;font-size: 28rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">学员:{{item.userName}}</view>
						<view style="margin-top:20rpx;font-size: 48rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;letter-spacing: 5rpx;"><text style="color:#9ECFFF">V</text><text style="color:#92A3FD">S</text></view>
						<view style="margin-top:20rpx;font-size: 32rpx;display: flex;justify-content: center;align-items: center;color: #8F8F8F;">训练{{item.byTime}}天</view>
					</view>
					<view style="width: 30%;height:112px;float: left;">
						<view style="width: 60%;height:22px;background-color: #92A3FD;border-radius: 22px;margin: 0 auto;font-size: 24rpx;color:#fff;
						display: flex;align-items: center;justify-content:center;">
							训练后
						</view>
						<view style="width: 160rpx;margin: 0 auto;margin-top: 20rpx;">
							<image class="imagg" :src="'http://101.43.223.224:8765/image/getImageById?id=' + item.caseEndingPhoto"></image>
						</view>
					</view>
				</view>
				<view class="info-container">
				    <view class="info-item">
				      <image class="iconn" src="@/static/tizhong.png"></image>
				      <text class="info-text">体重 - {{item.reduceWeight}}KG</text>
				    </view>
				    <view class="info-item">
				      <image class="iconn" src="@/static/jirou.png"></image>
				      <text class="info-text">体脂率 - {{item.reduceBfp}}KG</text>
				    </view>
					<view class="info-item">
						<text class="info-text" style="color: #87C3FF;">上传中</text>
					</view>
				  </view>
			</view>
			<view style="width: 100vh;height: 30rpx;"></view>
			<tabbar selected-index=3></tabbar>
	</view>
	
</template>

<script>
	export default {
		data() {
			return {
				count: 5,
				mUserId:0,
				show: false,
				rating: 0,
				stars: [1, 2, 3, 4, 5],
				courseList: [],
				current: 0,
				venuename : uni.getStorageSync('venuename'),
				status: 0,
				selectStatus:1,
				list: [
					{
						isClick:1,
						name: '全部记录'
					},
					{
						isClick:2,
						name: '审核中'
					}, {
						isClick:3,
						name: '已上传'
					}],
					DataArray:[]
			}
		},
		filters: {
		    formatDate(value) {
		      // 将value转换为Date对象
		      const date = new Date(value);
		      
		      // 进行时间格式转换
		      const formattedDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
		      
		      return formattedDate;
		    }
		},
		onShow() {
			this.selectUserInformation()
		},
		methods: {
			    hideDialog() {
				  uni.request({
				  	url: this.URL+'UserRecord/updateCsaeFroction',
				  	method: 'GET',
				  	data: {
				  		recordId: uni.getStorageSync('teacherinfo').id,
						memberUserId :this.mUserId,
						fraction:this.rating.toString()
				  	},
					success: (res) => {
						
						this.selectUserInformation()
						this.show = false;
					},
					})
			      
			    },
				// 选择评分
			    setRating(value) {
			      this.rating = value;
			    },
			// 选择评分
			changeFraction(item){
				this.mUserId =item.memberUserId 
				console.log("评分选择")
				 this.show = true;
				 this.rating = item.fraction
			},
			toApply(item){
				if(this.selectStatus ===1){
					uni.navigateTo({
						url: '/pages/coach/case/case?item='+JSON.stringify(item)
					})
				}
				
			},
			selectUserInformation() {
				var ths = this;
				uni.request({
					url: this.URL+'UserRecord/selectUserInformation',
					method: 'GET',
					data: {
						recordId: uni.getStorageSync('teacherinfo').id,
					},
					// userInfo:res.
					success: function(res) {
						ths.DataArray = res.data.data.data;
						console.log(ths.DataArray)
						console.log(res.data.data.data)
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			},
			
			changeSelect(item){
				this.selectStatus=item.isClick
				if(item.isClick == 1) {
					this.selectUserInformation()
				}else if(item.isClick == 2){
					this.selectStatus = item.isClick
					this.status = 0
					this.selectUserCase()
				}else{
					this.selectStatus = item.isClick
					this.status = 1
					this.selectUserCase()
				}
				
			},
			selectUserCase() {
				var ths = this;
				uni.request({
					url: this.URL+'UserRecord/selectUserCase',
					method: 'GET',
					data: {
						tid: uni.getStorageSync('teacherinfo').id,
						caseStatus: ths.status,
					},
					// userInfo:res.
					success: function(res) {
						ths.courseList = res.data.data.data;
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			},
			openTrain(item) {
				if(item.reservationStatus==1) {
					uni.navigateTo({
						url: '/pages/coach/train/started?item='+JSON.stringify(item)
					})
				}
				if(item.reservationStatus==2){
					uni.navigateTo({
						url: '/pages/coach/train/inProgress?item='+JSON.stringify(item)
						
					})
				}
				if(item.reservationStatus==3){
					uni.navigateTo({
						url: '/pages/coach/train/complete?item='+JSON.stringify(item)
					})
				}				
			},
			goSearch() {	
				uni.navigateTo({
					url: '/pages/coach/seach/seach'
				})
			},
		},
		// filters: {
		//     formatDate(timestamp) {
		//       const date = new Date(timestamp);
		//       const year = date.getFullYear();
		//       const month = date.getMonth() + 1;
		//       const day = date.getDate();
		
		//       return `${year}年${month}月${day}日`;
		//     },
		//   },
	}
</script>

<style>
	.div2 {
		width: 100%;
		height: 5vh;
	}
	
	.div2-2 {
		background-color: #fff;
		border-radius: 20px 20px;
		height: 70rpx;
		width: 60%;
		margin: 0 auto;
	}
	.view{
		width: 100%;
		height: 100vh;
		overflow: auto;
	}
	.view1{
		margin-top: 20rpx;
		width: 350rpx;
		height: 480rpx;
		margin-left: 20rpx;
		border-radius: 10px;
		float: left;
		background-color: white;
		box-shadow: 0 2px 5px #cacaca;
	}
	
	
	
	
	
	
	
	
	
	
	.week-item-d1{
		background-color: #9da4ff;
		width: 23px;height:23px;
		margin: 0 auto;
		border:#92A3FD;
		border-radius: 50%;
		margin-top: 1vh;
		font-size: 28rpx;
		padding-top: 2px;
		box-sizing: border-box;
		padding-right: 3rpx;
	}
	/* .div2{
		width: 100%;
		height: 5vh;
	}
	.div2-2{
		background-color:#fff;
		border-radius: 20px 20px;
		height: 70rpx;
		width: 90%;
		margin: 0 auto;
	} */
/* ::v-deep .div2-2 .input-placeholder {
    color: #FFF;
} */
.week-display {
	display: flex;
	justify-content: space-between;
	color: #fff;
	width: 90%;
	height: 8vh;
	margin: 0 auto;
	margin-top: 2vh;
}

.week-item {
	flex: 1;
	text-align: center;
}

.back {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden; /* 超出部分隐藏，可根据需求调整 */
}

.back::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* background-image: linear-gradient(to bottom right,  #94A9FD,#9ECFFF,#b9e1ff); */
	background-color: rgba(237, 245, 247, 1);
	z-index: -1;
}
.homeclick{
	height: 70rpx;
	width: 70rpx;
	margin-top: 20rpx;
}
.dao{
	 float: left;
	 width: 33.33%;
	 margin: 0 auto;
	 margin-top: 20rpx;
	 height: 45rpx;
	 font-size: 25rpx;
}
.dao-1{
	 border-bottom: skyblue 3px solid;
	 width: 50px;
	 margin: 0 auto;
	 height: 45rpx;
	 display: flex;
	 justify-content: center;
	 align-items: center;
}
.dao-2{
	 width: 50px;
	 margin: 0 auto;
	 height: 45rpx;
	 display: flex;
	 justify-content: center;
	 align-items: center;
}
.imagg{
	 width: 160rpx;
	 height: 160rpx;
	 border-radius: 4px;
}
.info-container {
  width: 100%;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.iconn {
  width: 32rpx;
  height: 32rpx;
}

.info-item {
  display: flex;
  align-items: center;
}

.info-text {
  font-size: 28rpx;
  text-indent: 10rpx;
  line-height: 32rpx;
}

.dialog-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 90rpx;
  border-radius: 15upx;
  z-index: 1000;
}

.rating { 
  font-size: 40rpx;
}

.filled {
  color: gold;
}
</style>
